<style lang="less">
    @import '../../styles/common.less';
    @import '../tables/components/table.less';
</style>
<template>
    <div>
        <!--<Form  :label-width="100" style="height: 38px;">-->
            <!--<Input v-model="phone"   placeholder="请输入手机号" @on-click="search" style="width: 200px;margin-right: 3px;float: left"></Input>-->
            <!--<FormItem label="订单状态" style="width: 300px;float: left" >-->
                <!--<Select  v-model="name" style="margin-right: 3px;" >-->
                    <!--<Option value="0">全部</Option>-->
                    <!--<Option value="待支付">待支付 </Option>-->
                    <!--<Option value="买方已支付">买方已支付</Option>-->
                    <!--<Option value="冻结中">冻结中</Option>-->
                    <!--<Option value="已完成">已完成</Option>-->
                    <!--<Option value="超时取消">超时取消</Option>-->
                    <!--<Option value="买方取消">买方取消</Option>-->
                    <!--<Option value="超时自动放币">超时自动放币</Option>-->
                <!--</Select>-->
            <!--</FormItem>-->
            <!--<Button type="info" style="float: right;margin-right: 5px" @click="search">查询</Button>-->
        <!--</Form>-->
        <Table :loading="loading" refs="table1"  :data="Message" :columns="columnsList"></Table>
        <Page :total="pageNum" :page-size="pageSize"  style="text-align: center;margin-top: 15px;"  @on-change="pageChange"></Page>
        <Modal title="图片预览" v-model="visible">
            <img :src="imgName " v-if="visible" style="width: 100%">
        </Modal>
    </div>
</template>
<script>
    import $http from '../../utils/axiosWrap'
    import canEditTable from '../tables/components/canEditTable.vue'
    export default {
        data() {
            return {
                phone:'',
                loading: true,
                Message:[],
                imgArr: [],
                admin:true,
                columnsList: [
                    {
                        title: '序号',
                        width: 80,
                        align: 'center',
                        render: (h, params) => {
                            return  params.index + (this.initPage- 1) * this.pageSize + 1
                        }
                    },
                    {
                        title: '订单ID',
                        align: 'center',
                        key: 'id',
                        editable: true
                    },
                    {
                        title: '卖家名',
                        align: 'center',
                        key: 'sellerName',
                        editable: true
                    },
                    {
                        title: '买家名',
                        align: 'center',
                        key: 'buyerName',
                        editable: true
                    },
                    {
                        title: '卖家手机',
                        align: 'center',
                        key: 'sellerTelephone',
                        editable: true
                    },
                    {
                        title: '买家手机',
                        align: 'center',
                        key: 'buyerTelephone',
                        editable: true
                    },
                    {
                        title: '价格',
                        align: 'center',
                        key: 'price',
                        editable: true
                    },
                    {
                        title: '数量',
                        align: 'center',
                        key: 'count',
                        editable: true
                    },
                    {
                        title: '总金额',
                        align: 'center',
                        key: 'totalPrice',
                        editable: true
                    },
                    {
                        title: '支付方式',
                        align: 'center',
                        key: 'payMethod',
                        editable: true
                    },
                    {
                        title: '支付宝账户',
                        align: 'center',
                        key: 'alipay',
                        editable: true
                    },
                    {
                        title: '银行',
                        align: 'center',
                        key: 'bank',
                        editable: true
                    },
//                    {
//                        title: '支行',
//                        align: 'center',
//                        key: 'bankBranch',
//                        editable: true
//                    },
                    {
                        title: '银行卡号',
                        align: 'center',
                        key: 'bankVard',
                        editable: true
                    },
                    {
                        title: '订单状态',
                        align: 'center',
                        key: 'orderStatus',
                        editable: true
                    },
                    {
                        title: '完成时间',
                        align: 'center',
                        width: 160,
                        render: (h, params) => {
                            if(params.row.finishTime){
                                return params.row.finishTime.replace(/\T/g, ' ').substring(0,19)
                            }else{
                                return ''
                            }
                        }
                    },
                    {
                        title: '操作',
                        align: 'center',
                        width:240,
                        render: (h, params) => {
                            return h('div', [
                                h('Button', {
                                    props: {
                                        type: 'success',
                                        size: 'small'
                                    },
                                    style: {
                                        marginRight: '5px'
                                    },
                                    on: {
                                        click: () => {
                                            this.pz(params)
                                        }
                                    }
                                }, '查看凭证'),
                                h('Button', {
                                    props: {
                                        type: 'primary',
                                        size: 'small'
                                    },
                                    style: {
                                        marginRight: '5px'
                                    },
                                    on: {
                                        click: () => {
                                            this.ty(params)
                                        }
                                    }
                                }, '放币'),
                                h('Button', {
                                    props: {
                                        type: 'error',
                                        size: 'small'
                                    },
                                    style: {
                                        marginRight: '5px'
                                    },
                                    on: {
                                        click: () => {
                                            this.jj(params)
                                        }
                                    }
                                }, '拒绝')
                            ]);
                        }
                    }
                ],
                name: '',
                pageNum:0,
                imgName: '',
                visible:false,
                initPage:1,
                pageSize:10
            }
        },
        created: function () {
            this.load()
        },
        methods: {
            pageChange(index){
                this.initPage = index
                this.loading = true
                this.load ()
            },
            load (){
                let _this = this
                let params = new URLSearchParams()
//                params.append('pno',_this.initPage)
                $http.post('/backgroundAuditor/frostOrders',params).then(function (res) {
                    if(res.suc){
                    _this.imgArr = []
                    _this.Message = []
                    for(var i = 0; i < res.result.length; i++){
                        _this.imgArr.push(res.result[i].imgUrl)
                        _this.Message.push(res.result[i].ctcOrder)
                    }
                    _this.loading = false
                    _this.pageNum = res.result.totalRow
                }else{
                    if(res.msg == "请先登录"){
                        _this.$Message.error('请重新登录！');
                    }else{
                        _this.$Message.error(res.msg);
                    }
                }
                })
            },
            pz(index){
                if(this.imgArr[index.index].split('.')[3].split('.')[1]){
                    this.imgName = this.imgArr[index.index]
                    this.visible = true
                }else{
                    this.$Message.error('暂无凭证!')
                }

            },
            ty(index){
                let _this = this
                let params = new URLSearchParams()
                params.append('id',index.row.id)
                $http.post('/ctcOrder/auditPut',params).then(function (res) {
                    if(res.suc){
                        _this.$Message.info('放币操作成功!')
                        _this.load()
                    }else{
                        if(res.msg == "请先登录"){
                            _this.$Message.error('请重新登录！');
                        }else{
                            _this.$Message.error(res.msg);
                        }
                    }
                })
            },
            jj(index){
                let _this = this
                let params = new URLSearchParams()
                params.append('id',index.row.id)
                $http.post('/ctcOrder/auditRepeal',params).then(function (res) {
                    if(res.suc){
                        _this.$Message.info('操作成功!')
                        _this.load()
                    }else{
                        if(res.msg == "请先登录"){
                            _this.$Message.error('请重新登录！');
                        }else{
                            _this.$Message.error(res.msg);
                        }
                    }
                })
            }

        }
    }
</script>
<style>
    .ivu-form-item {
        margin-bottom: 5px;
    }
</style>

